<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Burning Hero</title>
    <link rel="shortcut icon" href="ico/favicon (5).ico">
    <link rel="stylesheet" href="css/index.css">
    <link rel="stylesheet" href="css/base.css">
</head>
<!-- 注定伟大 -->
<body>
    <div class="nav">
        <a href=""><div class="navItem itemGroup3">成员</div></a>
        <a href=""><div class="navItem itemGroup2">殿堂</div></a>
        <a href="html/introduce.html"><div class="navItem itemGroup1">介绍</div></a>
        <a href=""><div class="navItem itemGroup1">历史</div></a>
        <a href=""><div class="navItem itemGroup2">柴设</div></a>
        <a href=""><div class="navItem itemGroup3">活动</div></a>
    </div>
    
        <div class="logoBox">
            <img src="/img/index_img/LOGOOO.png" alt="" class="centerLogo">
        </div>
        <div class="oneCircle"></div>
        <div class="twoCircle"></div>
        <div class="oneStar baseStar">
            <div class="star" style="transform: rotate(-50deg);">成员</div>
        </div>
        <div class="twoStar baseStar">
            <div class="star" style="transform: rotate(-170deg); background-color: #111; color: #fff;">介绍</div>
        </div>
        <div class="threeStar baseStar">
            <div class="star" style="transform: rotate(-300deg);";">柴设</div>
        </div>
    
        <div class="oneBigStar baseBigStar">
            <div class="star" style="transform: rotate(-95deg);">殿堂</div>
        </div>
        <div class="twoBigStar baseBigStar">
            <div class="star" style="transform: rotate(-230deg);">历史</div>
        </div>
        <div class="threeBigStar baseBigStar">
            <div class="star" style="transform: rotate(-350deg); background-color: #111; color: #fff;">活动</div>
        </div>
    
        <div class="mini1 baseMiniStar">
            <div class="miniStar"></div>
        </div>
        <div class="mini2 baseMiniStar">
            <div class="miniStar"></div>
        </div> 
        <div class="mini3 baseMiniStar">
            <div class="miniStar"></div> 
        </div>
  
    

    <div class="mini6 baseMiniStar2">
        <div class="miniStar"></div>
    </div>
    <div class="mini4 baseMiniStar2">
        <div class="miniStar"></div>
    </div>
    <div class="mini5 baseMiniStar2">
        <div class="miniStar"></div>
    </div>
    <div class="mini7 baseMiniStar2">
        <div class="miniStar"></div>   
    </div>
  
    <div class="title">每个人都是自己的英雄，我们注定渺小，我们注定伟大</div>
    <div class="titleEn">We are all our own heroes, we are destined to be small, we are destined to be great</div>
    <img src="img/index_img/Hero3.png" alt="" class="Hero">
    <img src="img/index_img/Burning.png" alt="" class="Burning">
    <script>
        let centerLogo = document.querySelector('.centerLogo')
        centerLogo.addEventListener('mouseover', function(){
            centerLogo.style.border = "1px solid #fff"
            alert("sss")
        })
        
    </script>
</body>
</html>